<template>
  <div>
    <h1 class="t">img-2 一个提高图片加载性能和体验的库，懒加载使用 web worker 模糊预览</h1>
    <div class="box">
      <img-2
        src="https://unsplash.it/400/200"
        width="400"
        height="267"
        src-preview="https://images.unsplash.com/photo-1455656678494-4d1b5f3e7ad4?ixlib=rb-0.3.5&q=1&fm=jpg&crop=entropy&cs=tinysrgb&w=10&height=10&fit=max"
        alt="An amazing picture of a cat"
      ></img-2>
    </div>
  </div>
</template>
<script>
export default {
  data: () => ({})
}
</script>
<style lang="scss" scoped>
.box {
  flex-grow: 0;
  flex-shrink: 0;
  margin: 0.5rem;
  padding: 0.5rem;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: rgba(241, 241, 241, 0.5);
  border-radius: 10px;
}
</style>